<template>
	<view class="noticeList">
		<template v-for="(item,index) in noticeList">
			<view class="noticeOne" :key="index" @click="toDetail(item)">
				<view class="title font16 bold hiddenOneline">{{item.title}}</view>
				<view class="content color666 font14 hiddenTwoline">{{item.content}}</view>
				<view class="flex alignCenter justConBetween">
					<view class="font12 color666">{{item.createTime}}</view>
					<view class="flex alignCenter oper" v-if="(preIdentity.userType!=2 && preIdentity.userState==1)">
						<view :class="item.isTop?'font12 bold':'font12 bold colorMain'" @click.stop="topClick(item,index)">{{item.isTop?'取消置顶':'置顶'}}</view>
						<view class="font12 bold" @click.stop="delNoticeClick(item,index)">删除</view>
					</view>
				</view>
				<image v-if="item.isTop" src="https://image.alhelp.net/uploads/20231104/9ceed48872586967616f975ca7f921e4.png" mode="widthFix"></image>
			</view>
		</template>
		<uni-nodata v-if="noticeList.length==0" :iconStyle="{'margin':'100rpx 0 0'}"></uni-nodata>
	</view>
</template>

<script>
	import { noticeList,addNotice,delNotice } from "@/api/send.js"
	export default {
		data() {
			return {
				page:1,
				pageSize:20,
				pageTotal:0,
				groupId:'',
				noticeList:[],
				preIdentity:''
			};
		},
		onLoad(option) {
			if(option.query){
				this.groupId=JSON.parse(option.query).id
				this.preIdentity=JSON.parse(option.query).preIdentity
			}
		},
		onShow() {
			this.initPage()
			this.getList()
		},
		methods:{
			initPage(){
				this.page=1;
				this.noticeList=[];
			},
			getList(){
				let param={
					page:this.page,
					size:this.pageSize,
					teamId:this.groupId,
				}
				noticeList(param).then((res)=>{
					if(res.code==100000){
						this.noticeList=this.noticeList.concat(res.data.rows)
						this.pageTotal=Math.ceil(res.data.total/this.pageSize)
					}
				})
			},
			// 置顶和取消置顶操作
			topClick(item,idx){
				uni.showModal({
					title: '提示',
					content: `是否确认${item.isTop?'取消置顶':'置顶'}该公告`,
					success: (res)=> {
						if (res.confirm) {
							let param={
								teamId:this.groupId,
								id:item.id,
								isTop:!item.isTop
							}
							addNotice(param).then((res)=>{
								if(res.code==100000){
									// this.noticeList[idx].isTop=!item.isTop
									this.initPage()
									this.getList()
								}
							}).catch((err)=>{})
						} else if (res.cancel) {
						}
					}
				});
			},
			// 删除公告
			delNoticeClick(item,index){
				uni.showModal({
					title: '提示',
					content: `是否确认删除该公告`,
					success: (res)=> {
						if (res.confirm) {
							delNotice({id:item.id}).then((res)=>{
								if(res.code==100000){
									this.initPage()
									this.getList()
								}
							})
						} else if (res.cancel) {
						}
					}
				});
			},
			// 公告详情
			toDetail(item){
				uni.navigateTo({
					url:'/pages/send/group/addNotice/addNotice?notice='+JSON.stringify(item)+'&id='+this.groupId
				})
			}
		},
		onPullDownRefresh() {
			this.initPage()
			this.getList()
			setTimeout(()=>{
				uni.stopPullDownRefresh()
			},1000)
		},
		onReachBottom() {
			if(this.page<this.pageTotal){
				++this.page
				this.getList()
			}else{
				uni.showToast({
					title:'我也是有底线的',
					icon:'none'
				})
			}
		}
	}
</script>
<style lang="scss" scoped>
@import "@/static/public.scss";
.noticeList{
	.noticeOne{
		position: relative;
		padding:30rpx;
		box-sizing: border-box;
		border-top:20rpx solid $bordercolor;
		.content{
			margin:20rpx 0;
		}
		image{
			width: 80rpx;
			height: 80rpx;
			left:-8rpx;
			top:0;
			position: absolute;
		}
		.oper{
			&>view{
				margin-left: 30rpx;
			}
		}
	}
}
</style>
